<!--
 * @Author: lide1202@hotmail.com
 * @Date: 2021-3-13 11:04:24 
 * @Last Modified by:   lide1202@hotmail.com
 * @Last Modified time: 2021-3-13 11:04:24 
 !-->
<template>
  <div class="text" :style="styleColor">文本框</div>
</template>

<script>
export default {
  name: 'WidgetText',
  components: {},
  props: {
    value: Object,
  },
  data() {
    return {
      options: {},
    }
  },
  computed: {
    transStyle() {
      return this.objToOne(this.options)
    },
    styleColor() {
      return {
        color: this.transStyle.color || '#fff',
        'font-weight': this.transStyle.fontWeight || '600',
        text: this.transStyle.text || '文本框',
        'font-size': this.transStyle.fontSize + 'px' || '12px',
        'letter-spacing': this.transStyle.letterSpacing + 'em',
        background: this.transStyle.background,
        'text-align': this.transStyle.textAlign,
        display: this.transStyle.hideLayer == undefined ? 'block' : this.transStyle.hideLayer ? 'none' : 'block',
      }
    },
  },
  watch: {
    value: {
      handler(val) {
        this.options = val
      },
      deep: true,
    },
  },
  mounted() {},
  methods: {},
}
</script>

<style scoped lang="scss">
.text {
  width: 100%;
  height: 100%;
}
</style>
